<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>添加活动</title>
    <style>
        .two-part-label{
            width: 200px !important;
        }
    </style>
</head>
<body>
<form class="layui-form" lay-filter="layui-form">
    <div class="mainBox">
        <div class="main-container">
            <div class="layui-form-item">
                <label class="layui-form-label">季节</label>
                <div class="layui-input-block">
                    <div class="xmSelect"
                         data-name="season"
                         data-radio="true"
                         data-sourceType="route"
                         data-source="/admin.sky.season/season"
                         data-textField="sub_category"
                         data-valueField="sub_category"
                    ></div>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">
                    <text style="color:red;">*</text>活动时间</label>
                <div class="layui-input-block">
                    <input type="text"
                           name="time"
                           class="layui-input laydate"
                           data-type="date"
                           data-isRange="true"
                           readonly="readonly"
                           placeholder="活动时间">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>背景图</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="bg_img"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">背景颜色</label>
                <div style="margin-left: 30px;">
                    <div id="bg_color_box"></div>
                    <input type="hidden" name="bg_color" id="bg_color" value="" />
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">日期背景颜色</label>
                <div style="margin-left: 30px;">
                    <div id="date_bg_color_box"></div>
                    <input type="hidden" name="date_bg_color" id="date_bg_color" value="" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">日期文字颜色</label>
                <div style="margin-left: 30px;">
                    <div id="date_word_color_box"></div>
                    <input type="hidden" name="date_word_color" id="date_word_color" value="" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">文字颜色</label>
                <div style="margin-left: 30px;">
                    <div id="word_color_box"></div>
                    <input type="hidden" name="word_color" id="word_color" value="" />
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航标题1</label>
                <div class="layui-input-block">
                    <input type="text" id="guide_title1" name="guide_title1" class="layui-input" lay-verify="required"  placeholder="导航标题" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航图标1</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="guide_img1"
                         data-accept="image"
                         data-type="ali-oss"
                         data-multi="false"
                         data-showChoiceBtn="false"
                         data-layVerify="required"
                    ></div>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航标题2</label>
                <div class="layui-input-block">
                    <input type="text" id="guide_title2" name="guide_title2" class="layui-input" lay-verify="required" placeholder="导航标题" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航图标2</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="guide_img2"
                         data-accept="image"
                         data-type="ali-oss"
                         data-multi="false"
                         data-showChoiceBtn="false"
                         data-layVerify="required"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航标题3</label>
                <div class="layui-input-block">
                    <input type="text" id="guide_title3" name="guide_title3" class="layui-input" lay-verify="required" placeholder="导航标题" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航图标3</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="guide_img3"
                         data-accept="image"
                         data-type="ali-oss"
                         data-multi="false"
                         data-showChoiceBtn="false"
                         data-layVerify="required"
                    ></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航标题4</label>
                <div class="layui-input-block">
                    <input type="text" id="guide_title4" name="guide_title4" class="layui-input" lay-verify="required" placeholder="导航标题" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><text style="color:red;">*</text>导航图标4</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="guide_img4"
                         data-accept="image"
                         data-type="ali-oss"
                         data-multi="false"
                         data-showChoiceBtn="false"
                         data-layVerify="required"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">页面索引图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon0"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">标签1</label>
                <div class="layui-input-block">
                    <input type="text" id="tag1" name="tag1" class="layui-input"  placeholder="请输入标签" value="">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签1图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon1"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签1视频封面</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="video_cover1"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label"><text style="color:red;">*</text>季节描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入季节描述" name="content1" id="LAY_demo1" lay-verify="content1"></textarea>
                </div>
            </div>



            <div class="layui-form-item">
                <label class="layui-form-label">标签2</label>
                <div class="layui-input-block">
                    <input type="text" id="tag2" name="tag2" class="layui-input"  placeholder="请输入标签" value="">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签2图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon2"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签2视频封面</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="video_cover2"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label"><text style="color:red;">*</text>季节描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入季节描述" name="content2" id="LAY_demo2" lay-verify="content2" ></textarea>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签3</label>
                <div class="layui-input-block">
                    <input type="text" id="tag3" name="tag3" class="layui-input" placeholder="请输入标签" value="">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签3图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon3"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签3视频封面</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="video_cover3"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">季节描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入季节描述" name="content3" id="LAY_demo3" lay-verify="content3"></textarea>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">标签4</label>
                <div class="layui-input-block">
                    <input type="text" id="tag4" name="tag4" class="layui-input" placeholder="请输入标签" value="">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签4图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon4"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">标签4视频封面</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="video_cover4"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">季节描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入季节描述" name="content4" id="LAY_demo4" lay-verify="content4" ></textarea>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签5</label>
                <div class="layui-input-block">
                    <input type="text" id="tag5" name="tag5" class="layui-input" placeholder="请输入标签" value="">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签5图标</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="tag_icon5"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">标签5视频封面</label>
                <div class="layui-input-block">
                    <div class="laytpUpload"
                         data-name="video_cover5"
                         data-accept="image"
                         data-type="ali-oss"
                         data-showChoiceBtn="false"
                    ></div>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">季节描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入季节描述" name="content5" id="LAY_demo5" lay-verify="content5" ></textarea>
                </div>
            </div>


        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="laytp-btn laytp-btn-primary laytp-btn-sm" lay-submit="" lay-filter="add">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="laytp-btn laytp-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>
<script>
    if(localStorage.getItem("staticDomain")){
        document.write("<link rel='stylesheet' href='" + localStorage.getItem("staticDomain") + "/component/layui/css/layui.css?v=" + localStorage.getItem("version") + "'>");
        document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
        document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
    }else{
        document.write("<link rel='stylesheet' href='/static/component/layui/css/layui.css?v=" + localStorage.getItem("version") + "'>");
        document.write("<script src='/static/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
        document.write("<script src='/static/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
    }
</script>
<script>
    layui.use(['laytp','xmSelect','colorpicker','layedit','form'], function () {
        let $ = layui.jquery;
        let form = layui.form;
        let colorpicker = layui.colorpicker;
        let layedit = layui.layedit;
        layedit.set({
            uploadImage:{
                url:"/admin.common/editUpload"
                ,type:''//默认post
            },
            uploadVideo:{
                url:"/admin.common/editUpload"
                ,type:''//默认post
            }
        })
        var index = layedit.build('LAY_demo1', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right','|','image','video'],
            height: 500,
        });
        var index1 = layedit.build('LAY_demo2', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right','|','image','video'],
            height: 500,
        });
        var index2 = layedit.build('LAY_demo3', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right','|','image','video'],
            height: 500,
        });
        var index3 = layedit.build('LAY_demo4', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right','|','image','video'],
            height: 500,
        });
        var index4 = layedit.build('LAY_demo5', {
            tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right','|','image','video'],
            height: 500,
        });


        //常规使用
        colorpicker.render({
            elem: '#bg_color_box' //绑定元素
            ,change: function(color){ //颜色改变的回调
                $('#bg_color').val(color);
            }
        });

        //常规使用
        colorpicker.render({
            elem: '#date_bg_color_box' //绑定元素
            ,change: function(color){ //颜色改变的回调
                $('#date_bg_color').val(color);
            }
        });

        //常规使用
        colorpicker.render({
            elem: '#date_word_color_box' //绑定元素
            ,change: function(color){ //颜色改变的回调
                $('#date_word_color').val(color);
            }
        });


        //常规使用
        colorpicker.render({
            elem: '#word_color_box' //绑定元素
            ,change: function(color){ //颜色改变的回调
                $('#word_color').val(color);
            }
        });

        form.verify({
            content1: function(value) {
                return layedit.sync(index);
            },
            content2: function(value) {
                return layedit.sync(index1);
            },
            content3: function(value) {
                return layedit.sync(index2);
            },
            content4: function(value) {
                return layedit.sync(index3);
            },
            content5: function(value) {
                return layedit.sync(index4);
            }
        });
        layui.form.on('submit(add)', function(data){
            var btnAnim = layui.button.load({elem:$(this)});
            facade.ajax({
                route:'/admin.sky.season/add',
                data : data.field
            }).done(function(res){
                if(res.code === 0){
                    parent.layui.layer.close(parent.layui.layer.getFrameIndex(window.name));//关闭当前页
                    parent.funController.tableRender();
                    parent.parent.renderMenu();//重新渲染菜单
                }
                btnAnim.stop();
            }).fail(function(){
                btnAnim.stop();
            });
            return false;
        });
    });
</script>
</body>
</html>